import React, { Component } from 'react';
import './Global.css'
class Global extends Component {
    constructor(props) {
        super(props)
    
        this.state = {
            globlist:[],
        }
    }
    componentDidMount(){
        this.$axios({
            url:"http://127.0.0.1:9115/toplist/detail"
        }).then(res=>{
            console.log(res.list.slice(4,34));
            this.setState(state=>{
                return{
                    globlist:res.list.slice(4,34),
                }
            })
        })
    }
    
    render() {
        return (
            <div className="global">
                <p className="globp">全球榜</p>
                <div className="glodiv">
                <ul className="globalul">
                    {
                        this.state.globlist.map((item,index)=>
                            <li className="globalli" key={index}>
                                <img src={item.coverImgUrl}/>
                                <p>{item.updateFrequency}</p>
                            </li>
                        )
                        
                    }
                    </ul>
                </div>
            </div>
        );
    }
}

export default Global;